<template>
  <section class="jumbotron">
    <h3 class="jumbotron-heading">Search Github Users</h3>
    <div>
      <input type="text" v-model="keyWord" placeholder="enter the name you search"/>&nbsp;<button @click="getUsers">Search</button>
    </div>
  </section>
</template>

<script>
import axios from 'axios';
export default {
  name: "Search",

  data(){
    return{
      keyWord:""
    }
  },
  methods:{
    getUsers(){
      this.$bus.$emit("userInfo", {isFirst:false,isLoading:true})
      axios.get(`https://api.github.com/search/users?q=${this.keyWord}`).then(
          response=>{
            this.$bus.$emit("userInfo",{isLoading:false,list:response.data.items})
          },
          error => {
            this.$bus.$emit("userInfo",{isLoading:false,list:[],errorMsg:error.message})
          }
      );

    }
  }
}
</script>

<style scoped>

</style>
